<!--
 * @Author: Evan Liu
 * @Date: 2022-03-23 11:31:38
 * @LastEditTime: 2022-11-14 10:54:08
 * @LastEditors: YanMeng
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \ias_ui\src\views\coi\channelInventory\index.vue
-->
<template>
  <div>
    <div class="tab">
      <el-radio-group v-model="value2" size="small" @change="handleChange">
        <el-radio-button v-for="item in filterBtn(tabList)" :key="item.id" :label="item.id">{{ item.name }}</el-radio-button>
      </el-radio-group>
    </div>
    <SwitchingTable v-model="value" :component-list="componentList">
      <component :is="value" :menu-name="value2" />
    </SwitchingTable>
  </div>
</template>

<script>
// import sku from './components/list'
import spu from '@/views/coi/spuChannelInventory/index/index'
import SwitchingTable from '@/views/coi/components/SwitchingTable'

export default {
  name: 'ChannelInventory',
  components: {
    sku: () => import('./components/list'),
    spu,
    SwitchingTable
  },
  data() {
    return {
      value: 'sku',
      componentList: [
        {
          name: 'SKU',
          id: 'sku',
          hidden: false
        },
        {
          name: 'SPU',
          id: 'spu',
          hidden: window.appConfig.hiddenNewProducts
        }
      ],
      tabList: [
        { id: 'WMDJ', name: '沃尔玛到家', hidden: false },
        { id: 'JDDJ', name: '京东到家', hidden: window.appConfig.hiddenNewProducts },
        { id: 'JDWX', name: '京东沃选', hidden: false }
      ],
      value2: 'WMDJ'
    }
  },
  activated() {
    const tab = this.$route.params.tab
    if (tab) this.value2 = tab
    this.handleChange(this.value2)
  },
  methods: {
    filterBtn(list) {
      return list.filter((_) => !_.hidden)
    },
    handleChange(e) {
      console.log('e********', e)
      // 因为京东到家没有spu渠道切换到该渠道时候隐藏spu，值切换到sku
      if (e === 'JDDJ') this.componentList[1].hidden = true
      else this.componentList[1].hidden = window.appConfig.hiddenNewProducts
      // 京东沃选在隐藏spu迭代的情况下需要直接跳转到spu的页面，此时是没有sku页面的（两者在同一个页面 spu页面）
      if (e === 'JDWX' && window.appConfig.hiddenNewProducts) this.value = 'spu'
      else this.value = 'sku'
      if (e === 'JDWX' && window.appConfig.hiddenNewProducts_Spu) {
        this.componentList[1].hidden = true
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.tab {
  margin-left: 20px;
}
</style>
